<template>
  <div class="ContactUs">
    <div class="topNav">
      <u-swiper
        class="sh-m-b-20"
        :list="list1"
        height="200"
        keyName="image"
        showTitle
        circular
      ></u-swiper>
    </div>
    <div class="content flex">
      <div class="left flex">
        <div class="icon flex">
          <u-icon name="email-fill" color="#fff" size="28"></u-icon>
        </div>
        <div>
          <p>邮箱联系</p>
          <p style="margin-top: 10rpx">747938243@qq.cpm</p>
        </div>
      </div>
      <div class="btn" @click="copyUrl">复制邮箱</div>
    </div>
    <div class="content flex">
      <div class="left flex">
        <div class="icon flex">
          <u-icon name="server-man" color="#fff" size="28"></u-icon>
        </div>
        <p>问题反馈</p>
      </div>
      <div class="btn" @click="toSend">反馈</div>
    </div>
    <!-- 	<div class="content flex">
			<div class="left flex">
				<div class="icon flex">
					<u-icon name="phone-fill" color="#fff" size="28"></u-icon>
				</div>
				<p>热线电话</p>
			</div>
			<div class="btn" @click="callPhone">咨询</div>
		</div> -->
  </div>
</template>

<script>
import globalFunc from "@/mixins/globalFunc.js";
import {} from "@/common/api/index.js";
export default {
  name: "ContactUs",
  data() {
    return {
      list1: [],
    };
  },
  mixins: [globalFunc],
  async onShow() {
    this.list1 = await this.banner("contact_page");
    await this.getQuestionList();
  },
  methods: {
    // 拨打电话
    callPhone() {
      uni.makePhoneCall({
        phoneNumber: "18384014924",
        success(res) {
          console.log(res, "拨打成功");
        },
        fail(err) {
          console.log(err, "拨打失败");
        },
      });
    },
    copyUrl() {
      uni.setClipboardData({
        data: "250405733@qq.com", // e是你要保存的内容
        success: function (e) {
          console.log("success", e);
          uni.showToast({
            title: "已复制剪切板",
            icon: "none",
          });
        },
        fail(err) {
          console.log("err", err);
        },
      });
    },
    toSend() {
      uni.navigateTo({
        url: `/pages/mine/sendMsg/sendMsgList`,
      });
    },
  },
};
</script>

<style scoped lang="scss">
.ContactUs {
  padding: 30rpx 50rpx;
  background-color: #fafafa;
  height: 100vh;
  box-sizing: border-box;

  .topNav {
    background-color: #fff;
    border-radius: 50rpx;
  }

  .content {
    justify-content: space-between;
    align-items: center;
    padding: 50rpx 20rpx;
    margin-top: 20rpx;
    background-color: #fff;
    border-radius: 20rpx;
    font-size: 26rpx;

    .left {
      align-items: center;

      .icon {
        width: 80rpx;
        height: 80rpx;
        background-color: #22c903;
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        margin-right: 20rpx;
      }
    }

    .btn {
      padding: 10rpx 30rpx;
      background-color: #22c903;
      color: #fff;
      border-radius: 40rpx;
    }
  }

  .title {
    margin: 20rpx 0;
    font-size: 40rpx;
    font-weight: 600;
  }
}
</style>
